<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:pe="http://primefaces.org/ui/extensions"
      xmlns:fn="http://java.sun.com/jsp/jstl/functions"
      xmlns:sec="https://joinfaces.org/security"
      xmlns:fun="http://java.sun.com/jsp/jstl/functions"
      xmlns:p="http://primefaces.org/ui"
      lang="#{p:language()}" xml:lang="#{p:language()}">

<c:set var="viewNames" value="#{menuView.viewName[request.requestURI]}"/>

<h:head>
    <f:facet name="first">
        <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
        <meta name="apple-mobile-web-app-capable" content="yes"/>

        <link href="#{resource['blog/images/favicon-32x32.png']}" rel="icon" type="image/png" sizes="32x32"/>
        <link href="#{resource['blog/images/favicon-16x16.png']}" rel="icon" type="image/png" sizes="16x16"/>
    </f:facet>
    <title><ui:insert name="title">#{viewNames.get(viewNames.size()-1)}</ui:insert></title>

    <h:outputScript name="locales/locale-#{p:language()}.js" library="primefaces"/>
    <h:outputScript name="js/layout.js" library="ecuador-layout"/>
    <h:outputScript name="js/prism.js" library="ecuador-layout"/>
    <h:outputScript name="js/common.js" library="framework"/>
    <h:outputScript name="js/app.js" library="blog"/>

    <h:outputStylesheet name="css/layout-#{guestPreferences.theme}.css" library="ecuador-layout"/>
    <h:outputStylesheet name="css/primeflex.min.css" library="ecuador-layout"/>
    <h:outputStylesheet name="css/common.css" library="framework"/>
    <h:outputStylesheet name="css/app.css" library="blog"/>

    <ui:insert name="head"/>
</h:head>

<c:set var="principal" value="#{p:userPrincipal().principal}"/>

<ui:insert name="body">
    <h:body styleClass="#{guestPreferences.inputStyleClass}">
        <p:outputPanel id="layout_panel"
                       styleClass="layout-wrapper #{guestPreferences.menuMode} layout-menu-#{guestPreferences.menuColor} #{guestPreferences.orientationRTL ? 'layout-rtl' : null}">
            <ui:include src="topbar.xhtml"/>
            <ui:include src="right_panel.xhtml"/>
            <ui:include src="menu.xhtml"/>
            <ui:include src="config.xhtml"/>

            <div class="layout-main">
                <div class="route-bar">
                    <div class="route-bar-breadcrumb">
                        <ul id="viewname">
                            <li>
                                <a href="dashboard.xhtml">
                                    <i class="pi pi-home"/>
                                </a>
                            </li>
                            <ui:insert name="viewname">
                                <p:repeat value="#{menuView.viewName[request.requestURI]}" var="viewname">
                                    <li>/</li>
                                    <li>#{viewname}</li>
                                </p:repeat>
                            </ui:insert>
                        </ul>
                    </div>
                </div>

                <div class="layout-content">
                    <div class="p-grid">
                        <div class="p-col-12">
                            <ui:insert name="content"/>
                        </div>
                    </div>
                </div>

                <div class="layout-footer">
                    <ui:include src="footer.xhtml"/>
                </div>
            </div>

            <ui:insert name="dialog"/>

            <p:confirmDialog id="confirmDialog" widgetVar="confirmDialog"
                             global="true" showEffect="fade" hideEffect="fade" width="400">
                <p:commandButton value="#{msg['framework']['confirm']}" type="button"
                                 styleClass="ui-confirmdialog-yes" icon="fa fa-check"/>
                <p:commandButton value="#{msg['framework']['cancel']}" type="button"
                                 styleClass="ui-confirmdialog-no ui-button-secondary" icon="fa fa-close"/>
            </p:confirmDialog>

            <p:confirmPopup id="confirmPopup" widgetVar="confirmPopup" global="true">
                <p:commandButton value="#{msg['framework']['confirm']}" type="button"
                                 styleClass="ui-confirm-popup-yes ui-button-flat"/>
                <p:commandButton value="#{msg['framework']['cancel']}" type="button"
                                 styleClass="ui-confirm-popup-no ui-button-flat ui-button-secondary"/>
            </p:confirmPopup>

            <p:growl id="messages" widgetVar="globalMessages" for="globalMessages"
                     showDetail="true" showSummary="true" sticky="false" life="3000"
                     redisplay="true">
                <p:autoUpdate/>
            </p:growl>

            <p:dialog widgetVar="statusDialog" modal="true" draggable="false" closable="false"
                      resizable="false" showHeader="false" onHide="">
                <div class="p-text-center" style="padding-top: 2rem;">
                    <p:graphicImage name="images/loading.gif" library="blog" width="80"/>
                </div>
            </p:dialog>

            <p:ajaxStatus styleClass="layout-ajax-loader" onstart="PF('statusDialog').show()"
                          oncomplete="PF('statusDialog').hide()"/>

            <p:ajaxExceptionHandler type="java.lang.Exception"
                                    update="exceptionDialog"
                                    onexception="PF('exceptionDialog').show()"/>


            <p:dialog id="exceptionDialog" header="#{msg['error']['systemError']}"
                      widgetVar="exceptionDialog" modal="true" blockScroll="true">
                <p:outputPanel style="max-height: 500px;  overflow-y: auto"
                               rendered="#{pfExceptionHandler.type ne 'com.dandandog.framework.faces.exception.MessageResolvableException'}">
                    <h3>Exception '#{pfExceptionHandler.type}' occured!</h3>
                    Message: #{pfExceptionHandler.message} <br/>
                    StackTrace: <h:outputText value="#{pfExceptionHandler.formattedStackTrace}" escape="false"/>
                </p:outputPanel>

                <p:outputPanel style="width: 600px"
                               rendered="#{pfExceptionHandler.type eq 'com.dandandog.framework.faces.exception.MessageResolvableException'}">
                    <p:staticMessage severity="error" summary="#{msg['error']['dataError']}"
                                     detail="#{msg['error']['dataNotFound']}" style="width: 100%; padding:20px"/>
                </p:outputPanel>
                <f:facet name="footer">
                    <p:outputPanel layout="inline">
                        <p:commandButton id="saveButton" widgetVar="saveButton" styleClass="entity-dialog-save-btn"
                                         process="@none"
                                         value="#{msg['blog']['reload']}"
                                         onclick="document.location.href = document.location.href;"/>
                    </p:outputPanel>
                </f:facet>
            </p:dialog>
        </p:outputPanel>
    </h:body>
</ui:insert>

</html>
